import Vue from 'vue'
import App from './App'
import Layout from './ch8/8.1Layout'
import VueRouter from 'vue-router'
import MainContent from './components/mainContent'
import Index from './ch8/8.1index'
//import TeacherList from './components/teacherList'
import CourseList from './components/course'
import TeacherList from './components/teacher'
import Detail from './ch8/8.2detail'
import Axios from './ch8/8.3axios'
import MintUi from './ch9/9.2mintUi'
import MintCase from './ch9/mintCase'
//import Page1 from './ch8/page1'
//import Page2 from './ch8/page2'
//import Header1 from './ch8/header1'
//import Header2 from './ch8/header2'
//import Nameview from './ch8/8.2nameview'
import Mint from 'mint-ui'
import axios from 'axios'
import  VueResource  from 'vue-resource'
Vue.use(VueResource)
Vue.prototype.$axios = axios;
Vue.use(Mint);
import 'mint-ui/lib/style.css'
Vue.config.productionTip = false
Vue.use(VueRouter)
Vue.directive('rainbow',{
	bind(el,binding,vnode){
		el.style.color="#"+Math.random().toString(16).slice(2,8);
	}
})
let router = new VueRouter({
	mode: 'history',
	routes: [
		{
			path: '/',
			component: Index
		},
		{
			path: '/detail',
			component: Detail
		},
	    {	path: '/course',
			component: CourseList
		},
		 {	path: '/case',
			component: MainContent
		},
		{	path: '/teacher',
			component: TeacherList
		},
//		{
//		      path: '/page1',
//		      name: 'page1',
//		      components: { // 注意这里是components 复数复数复数！
//		        header: Header1, //设置header模板
//		        main: Page1 //设置main模板
//		      }
//		},
//		{
//		      path: '/page2',
//		      name: 'page2',
//		      components: { // 注意这里是components 复数复数复数！
//		        header: Header2, //设置header模板
//		        main: Page2 //设置main模板
//		      }
//		},

	]
})
new Vue({
  el: '#app',
 //<!--8.1和8.2的实例使用Layout组件-->
//components: { Layout },
//template: '<Layout/>',
 //<!--8.3的实例使用Axios组件--
//components: { Axios },
//template: '<Axios/>',
//<!--8.5章节案例使用App组件-->
components: { App },
template: '<App/>',
//<!--9.2实例使用-->
//components: { MintUi },
//template: '<MintUi/>',
//<!--9章案例使用MintCase组件-->
//components: { MintCase },
//template: '<MintCase/>',
//components: { Nameview },
//template: '<Nameview/>',
   router,
})
